import { Component } from '@angular/core';
declare var $:any;

@Component({
  moduleId: module.id,
  selector: 'sd-home',
  styleUrls:[ 'organization.component.css'],
  templateUrl: 'organization.component.html'
})


export class OrganizationComponent {
	cNodes =[
	  { id:1, pId:0, name:"IT部门", open:true},
	  { id:11, pId:1, name:"技术部", open:true},
	  { id:111, pId:11, name:"前端部门"},
	  { id:12, pId:1, name:"运维部", open:true},
	  { id:121, pId:12, name:"运维技术部"},
	  { id:13, pId:1, name:"研发部",  open:true},
	  { id:131, pId:13, name:"UI部门",open:true},
	  { id:132, pId:13, name:"产品设计", open:true},
	  { id:133, pId:13, name:"市场调查", open:true},
	  { id:134, pId:13, name:"市场分析", open:true},
	  { id:135, pId:13, name:"市场主管", open:true},
	  { id:136, pId:13, name:"市场助理", open:true},
	  { id:2, pId:0, name:"财务部门", open:true},
	  { id:21, pId:2, name:"财务部",open:true},
	  { id:221, pId:21, name:"财务科长",open:true},
	  { id:222, pId:21, name:"财务副科长",open:true},
	  { id:223, pId:21, name:"会计",open:true},
	  { id:234, pId:21, name:"审计科长",open:true},
	  { id:2341, pId:234, name:"审计副科长",open:true},
	  { id:2342, pId:234, name:"核对副科长",open:true},
	  { id:235, pId:21, name:"出纳",open:true},
	  { id:236, pId:21, name:"会计行政",open:true},
	  { id:3, pId:0, name:"市场部", open:true},
	  { id:31, pId:3, name:"总经理",open:true},
	  { id:321, pId:31, name:"市场1部主管",open:true},
	  { id:322, pId:31, name:"市场2部主管",open:true},
	  { id:323, pId:31, name:"市场3部主管",open:true},
	  { id:334, pId:31, name:"市场4部主管",open:true},
	  { id:3341, pId:334, name:"副主管",open:true},
	  { id:3342, pId:334, name:"市场监督主管",open:true},
	  { id:335, pId:31, name:"市场品质部主管",open:true},
	  { id:336, pId:31, name:"市场调研部",open:true},
	];

	Osetting = {

		data: {
      		simpleData: {
        		enable: true,
        		idkey:'id',
        		pIdkey:'pId',
        		rootPId:0,
      		},
      		key: {
      			name: "name",
      		} 
    	},
    	edit:{
    		enable: true,
    		removeTitle: '删除',
    		renameTitle: '编辑',
    		drag: {
    			isMove: true,
    			isCopy: false,
    		},	
    	},
    	view:{
    		nameIsHTML: true,
    	},
    	callback: {	
    		beforeRemove: this.zTreeBeforeRemove,
    		beforeRename: this.zTreeBeforeRename,
		}
	};
	
    
	//当点击ztree中节点的编辑按钮则实现对节点标题进行修改。
	zTreeBeforeRename = function (treeId:number, treeNode:any[], newName:any[], isCancel:any[]) {

	    $.ajax({
	        url: '',
	        data: {
	            
	        },
	        type: 'PUT',
	        dataType: 'json',
	        async: false, //同步请求
	        success: function (response:any) {
	            isCancel = response.IsSuccess;
	        },
	        error: function (err:string) {
	            console.log(err);
	        }
	    });

	    return isCancel;
	};

	//当点击ztree中节点的删除按钮则删除该节点及其子节点。
	zTreeBeforeRemove = function (treeId:any[], treeNode:any[]) {

	    var result = confirm('是否删除部门？');
	    if (!result)
	        return false;

	    $.ajax({
	        url: '',
	        data: {

	        },
	        type: 'DELETE',
	        dataType: 'json',
	        async: false, //同步请求
	        success: function (response:any) {
	            result = response.IsSuccess;
	        },
	        error: function (err:string) {
	            console.log(err);
	        }
	    });

	    return result;
    };

    contenttipso = {
        error: function(message:string) {
            $('.content-header-tipso').addClass('error').html(message).show();
            setTimeout(function () {
                $('.content-header-tipso').removeClass('error').hide();
            }, 3000);
        },
        success: function (message:string) {
            $('.content-header-tipso').addClass('success').html(message).show();
            setTimeout(function () {
                $('.content-header-tipso').removeClass('success').hide();
            }, 3000);
        }

    };
	
	ngOnInit(){

        $.fn.zTree.init($("#organization-tree"), this.Osetting, this.cNodes);
        function changeBoxBody() {
            var height = $(window).height() - 244;
            $('.box-body').slimScroll({'height': height });
            $('.tips  i').removeClass('fa-check');
            $('.tips  i').removeClass('fa-times');
            $('.tips-content').html('');
        };
        $(window).ready(function () {
            changeBoxBody();
        });
        $(window).resize(function () {
            changeBoxBody();
        });
        $('.suggest-special').mouseenter(function () {
            $('.suggest-top').show();
        }).mouseleave(function () {
            $('.suggest-top').hide();
        });
		//表单验证Start
		$('input[type="text"]').bind('keydown',function(){
			if($(this).val() == ""){
			 	$(this).css('border','1px solid red');
				$(this).next().find('i.fa').css({color:'red'}).removeClass('fa-check').addClass('fa-times');
				$(this).next().find('div.tips-content').html("不能为空");
				$(this).next().show();
			}else{
				$('.tips i').removeClass('fa-times');
				$(this).css('border','1px solid green');
				$(this).next().find('i.fa').css({color:'green'}).removeClass('fa-times').addClass('fa-check');
				$(this).next().find('div.tips-content').html("可用");
				$(this).next().show();
			}
        });

		$('input[type="text"]').bind('keyup',function(){
            if ($(this).val() == "") {
                $(this).css('border', '1px solid red');
                $(this).next().find('i.fa').css({ color: 'red', cursor: 'pointer' }).removeClass('fa-check').addClass('fa-times');
                $(this).next().find('div.tips-content').html("不能为空");
                $(this).next().show();
            }
        });

        $("#OrganizationName").bind('input', function () {
            var reg = /[\u4E00-\u9FA5]/g;
            if (reg.test($(this).val()) == false) {
                console.log(13);
                $(this).css('border', '1px solid red');
                $(this).next().find('i.fa').css({ color: 'red', cursor: 'pointer' }).removeClass('fa-check').addClass('fa-times');
                $(this).next().find('div.tips-content').html("部门名称是汉字");
                $(this).next().show();
            }
        });
        var cityNodes = [
            {
                "id": 0,
                "name": "北京",
                "code": "001",
                "child": [
                    {
                        "id": 0,
                        "name": "东城区",
                        "child": []
                    },
                    {
                        "id": 1,
                        "name": "西城区",
                        "child": []
                    },
                    {
                        "id": 2,
                        "name": "崇文区",
                        "child": []
                    },
                    {
                        "id": 3,
                        "name": "宣武区",
                        "child": []
                    },
                    {
                        "id": 4,
                        "name": "朝阳区",
                        "child": []
                    },
                    {
                        "id": 5,
                        "name": "丰台区",
                        "child": []
                    }
                ]
            },
            {
                "id": 1,
                "name": "广西",
                "code": "002",
                "child": [
                    {
                        "id": 0,
                        "name": "南宁",
                        "child": [
                            { "value": "兴宁区" },
                            { "value": "青秀区" },
                            { "value": "江南区" },
                            { "value": "西乡塘区" },
                            { "value": "良庆区" },
                            { "value": "邕宁区" },
                            { "value": "武鸣县" },
                            { "value": "隆安县" }
                        ]
                    },
                    {
                        "id": 1,
                        "name": "柳州",
                        "child": [
                            { "value": "城中区" },
                            { "value": "鱼峰区" },
                            { "value": "柳南区" },
                            { "value": "柳北区" }
                        ]
                    },
                    {
                        "id": 2,
                        "name": "桂林",
                        "child": [
                            { "value": "秀峰区" },
                            { "value": "叠彩区" },
                            { "value": "象山区" }
                        ]
                    },
                    {
                        "id": 3,
                        "name": "百色",
                        "child": [
                            { "value": "右江区" },
                            { "value": "平果县" },
                            { "value": "田阳县" },
                            { "value": "田东县" },
                            { "value": "德保县" }
                        ]
                    }
                ]
            },
            {
                "id": 2,
                "name": "广东",
                "code": "003",
                "child": [
                    {
                        "id": 0,
                        "name": "广州",
                        "child": [
                            { "value": "天河区" },
                            { "value": "白云区" },
                            { "value": "黄埔区" }
                        ]
                    },
                    {
                        "id": 1,
                        "name": "深圳",
                        "child": [
                            { "value": "宝安区" },
                            { "value": "南山区" },
                            { "value": "福田区" }
                        ]
                    },
                    {
                        "id": 2,
                        "name": "珠海",
                        "child": []
                    }
                ]
            }
        ];

        $("#address").bind('input', function () {
            for (var i = 0; i < cityNodes.length; i++) {
                if (cityNodes[i].name == $(this).val()) {
                    $('#provice li').html(cityNodes[i].name);
                    var n = cityNodes[i].child.length;
                    for (var j = 0; j < n; j++) {
                        var s = '<li>' + cityNodes[i].child[j].name + '</li>';
                        $('#cities').append(s);
                        $('.provice-wrapper').show();
                        var m = cityNodes[i].child[j].child.length;
                        if (m > 0) {
                            for (var k = 0; k < m; k++) {
                                var t = '<li>' + cityNodes[i].child[j].child[k].value + '</li>';
                                $('#county').append(t);
                            }
                        }
                    }

                }
            }
        });
        
        //验证表单结束
	};

	FullScreeToggle = function() {

		var backgroundColor = $('.content-wrapper').css('background');

		$('.fixed .content-wrapper').fullScreen({

			'background': backgroundColor,
			'marginLeft' : 0,
			'paddingTop' : 0,
			'callback': function(isFullScreen:boolean){
				if(isFullScreen == true){
					$('.btn-group span').html('退出全屏').attr('title','退出全屏');
					$('.content-wrapper').css({'padding-top':0,'margin-left':0});
					var height = $(window).height()-182;
                    $('.box-body').slimScroll({ 'height': height });
					return ;
				}

				$('.btn-group span').html('全屏').attr('title','全屏');
				$('.content-wrapper').css({'padding-top':'60px','margin-left':'230px'});
				var height = $(window).height()-244;
                $('.box-body').slimScroll({ 'height': height });
			}
		});
  	}

  	//实现“上移”的点击事件
    moveUpOrganization = function () {
        var that = this;
        var treeObj = $.fn.zTree.getZTreeObj("organization-tree");
        var nodes = treeObj.getSelectedNodes();
        
        if (nodes == "") {
            that.contenttipso.error('请选择上移的部门');
            return;
        }

        var childrens = nodes[0].getParentNode().children;

        for (var i = 0; i < childrens.length; i++) {
            if (childrens[i].id == nodes[0].id) {
                var index = i - 1;
            }
        }

        index = (index < 0) ? 0 : index;

        treeObj.moveNode(nodes[0].getParentNode().children[index], nodes[0], 'prev');
        that.contenttipso.success('部门移动成功');
    };

  	//实现“下移”的点击事件
    moveDownOrganization = function () {
        var that = this;
  		var treeObj = $.fn.zTree.getZTreeObj("organization-tree");
  		var nodes = treeObj.getSelectedNodes();
		
  		if(nodes == ""){
                that.contenttipso.error('请选择部门');
        	return ;
        }
		var childrens = nodes[0].getParentNode().children;
  	
  		for(var i=0;i<childrens.length;i++){
  			if(childrens[i].id == nodes[0].id){	
  				var index = i+1;   		 
  			}
  		}
  		
  		index = (index>childrens.length-1)? childrens.length-2 : index;
            treeObj.moveNode(nodes[0].getParentNode().children[index], nodes[0], "next");
            that.contenttipso.success('部门移动成功');
  		
        
  	}

  	//实现“删除”的点击事件
    removeOrganization = function () {
        var that = this;
  		var treeObj = $.fn.zTree.getZTreeObj("organization-tree");
  		var nodes = treeObj.getSelectedNodes();

  		if(nodes == ""){
                that.contenttipso.error('请选择要删除的部门');
  		  return ;
  		}

  		$('#'+nodes[0].tId).remove();
  	}

    newNodes = this.cNodes;
  	//实现“刷新”的点击事件
   refreshOrganization = function () {
  		var zTreeObj = $.fn.zTree.init($("#organization-tree"), this.Osetting, this.newNodes);
  	
  	}

  	//实现“增加子部门”的点击事件
   addChildrenOrganization = function () {
        var that = this;
  	    var treeObj = $.fn.zTree.getZTreeObj("organization-tree");
  		var nodes = treeObj.getSelectedNodes();
  		if(nodes == ""){
                that.contenttipso.error('请选择部门');
  			return ;
        }
            
  		if(nodes.isParent){
  			var id = nodes[nodes.length-1].id + 1;
  		}

  		 id = nodes[0].id *10 + 1;

  		
        var newOrganizationName = $("#OrganizationName").val(); 
        if (newOrganizationName == ""){
            that.contenttipso.error('部门名称不能为空');
  			return ;
  		}

        var reg = /[\u4E00-\u9FA5]/g;
        console.log(reg.test(newOrganizationName));
        if (reg.test(newOrganizationName) == false) {
            $('#OrganizationName').css({ 'border-color': 'red' });
            $('.tips i.fa').addClass('fa-times').css({ color: 'red' }).show();
            $('.tips-content').html('请输入汉字！').css({ color: 'red',cursor:'pointer' }).show();
        }
        
  		var newOrganizationNameID = nodes[0].id;
  		var newNodes = {'id':id,'pId':newOrganizationNameID,'name':newOrganizationName};
  		treeObj.addNodes(nodes[0],0,newNodes);
  		var arr =treeObj.transformToArray(treeObj.getNodes());
  		var s = [];
  		for(var i=0; i<arr.length;i++){
  			var obj = {
  				id:'',
  				pId:'',
  				name:''
  			};

  			obj.id = arr[i].id;
  			obj.pId = arr[i].pId;
  			obj.name = arr[i].name;
  			s.push(obj);
  		}
            
  	}

}
